<template>
    <data-form ref="dataFormRef" :rule-field="['tableName', 'fieldName', 'fieldDesc']" :model="form" description="字典">
        <el-form-item v-show="false" prop="combinationId">
            <el-input v-model="form.combinationId"/>
        </el-form-item>
        <el-form-item label="表名" prop="tableName">
            <el-input v-model="form.tableName"/>
        </el-form-item>
        <el-form-item label="英文名称" prop="fieldName">
            <el-input v-model="form.fieldName"/>
        </el-form-item>
        <el-form-item label="中文名称" prop="fieldDesc">
            <el-input v-model="form.fieldDesc"/>
        </el-form-item>
        <el-form-item v-if="isCreate" label="键值数量" prop="childrenNum">
            <el-input-number v-model="form.childrenNum" :min="1" style="width: 100%"/>
        </el-form-item>
    </data-form>
</template>

<script lang="ts" setup>
import {ref} from 'vue'
import DataForm from "@/components/data-form/index.vue";

const dataFormRef = ref<InstanceType<typeof DataForm>>()
const isCreate = ref(true);
const form = ref({
    combinationId: undefined,
    tableName: undefined,
    fieldName: undefined,
    fieldDesc: undefined,
    childrenNum: 1
})

const open = (options: OpenFormConfig) => {
    isCreate.value = !(options.data?.tableName && options.data?.fieldName)
    dataFormRef.value?.open(options);
}
defineExpose({
    open
})
</script>

<style></style>
